<template>
  <a-tabs v-model="activeKey"
          hideAdd
          :type="$store.getTheme('tabType')"
          @change="onTabChange"
          @edit="onEdit">
    <a-tab-pane v-for="(page, index) in pages"
                :key="page.meta.aliveKey"
                :closable="pages.length > 1">
      <a-dropdown slot="tab"
                  :trigger="['contextmenu']">
        <span style="display:inline-block; height: 100%">
          {{ getTabTitle(page) }}
        </span>
        <a-menu slot="overlay">
          <a-menu-item @click="refresh(page)"
                       key="refresh">
            <a-icon type="reload" />
            刷新
          </a-menu-item>
          <a-menu-item @click="onEdit(page.meta.aliveKey, 'remove')"
                       v-if="pages.length > 1">
            <a-icon type="close" />
            关闭
          </a-menu-item>
          <a-menu-item @click="closeOther(page, index)"
                       v-if="pages.length > 1">
            <a-icon type="close-circle" />
            关闭其他
          </a-menu-item>
          <a-menu-item @click="closeRight(page, index)"
                       v-if="pages.length > 1">
            <a-icon type="arrow-right" />
            关闭右侧
          </a-menu-item>
          <a-menu-item @click="closeLeft(page, index)"
                       v-if="pages.length > 1">
            <a-icon type="arrow-left" />
            关闭左侧
          </a-menu-item>
        </a-menu>
      </a-dropdown>
    </a-tab-pane>
  </a-tabs>
</template>

<script>

export default {
}
</script>

<style lang="less" scoped>
</style>